<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%
	String path = request.getContextPath();
	request.setAttribute("path",path);
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="css/css.css" />
<link rel="stylesheet" type="text/css" href="css/style.css" />
<script type="text/javascript"
	src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
<script src="layer/layer.js" type="text/javascript"></script>
<script src="js/main.js" type="text/javascript"></script>
<title>注册</title>
<script type="text/javascript">
	//选中的性别
	var userSex="M";
	//性别切换
	function setSex(t){
		userSex = t.id;
		if(t.id == "M"){
			$("#F").removeClass("login-redcolor");
			$("#M").addClass("login-redcolor");
		}else{
			$("#M").removeClass("login-redcolor");
			$("#F").addClass("login-redcolor");
		}
	}
	//注册
	function register(){
		//获取注册的参数
		var userTel = $.trim($("#userTel").val());
		var userPwd = $.trim($("#userPwd").val());
		var userName = $.trim($("#userName").val());
		//手机号码正则
		var telTest = /^1[3|4|5|8][0-9]\d{4,8}$/; 
		if (!telTest.test(userTel)) {
			layer.msg('请输入有效的手机号码');
		}else if(userPwd.length < 6 || userPwd.length > 20){
			layer.msg('请输入6~20位密码');
		}else if(userName.length < 2 || userName.length > 10){
			layer.msg('请输入2~10位用户名');
		}else{
			$.post("UserServlet/register",{"userTel":userTel,"userPwd":userPwd,"userName":userName,"userSex":userSex},function (data) {
				  if(data == -1)
					layer.msg('手机号码已被注册');
				  else if(data == 0)
					layer.msg('注册失败');
				  else
					top.location.reload()
			},"text");
		}	
	}
</script>
</head>
<body>

	<!--register begin-->
	<div class="m-login">
		<div class="login-logo">
			<img src="images/common/logo.png" />
		</div>
		<div class="login-title border-bot">欢迎注册加入会员中心</div>
		<div class="input-box  border-bot">
			<img src="images/login/icon-phone.png" /><input type="text"
				id="userTel" placeholder="请输入手机号" class="input-box1" />
		</div>
		<div class="input-box  border-bot">
			<img src="images/login/icon-password.png" /><input type="text"
				id="userPwd" placeholder="密码，长度6-16字符" class="input-box1" />
		</div>
		<div class="input-box  border-bot">
			<img src="images/login/icon-name.png" /><input type="text"
				id="userName" placeholder="姓名，长度4-20字符" /> <span><a href="#"
				id="M" onclick="setSex(this)" class="login-redcolor">先生</a> | <a
				href="#" id="F" onclick="setSex(this)" style="margin: 0">女士</a></span>
		</div>
		<div class="input-box "></div>
		<div class="login-me cursor" onclick="register()">
			<button class="cursor">立即注册</button>
		</div>
	</div>
	<!--register end-->
</body>
</html>